<extend name="Base/common"/>

<block name="head"></block>
<block name="body">
    <div class="container text-center">
        <div class="booking_title"><h1>課程簡介</h1></div> 
              {$CateGoryList.detail}
    </div>
    
        <div class="container">
        <div class="booking_title"><h1>樂器</h1></div> 
        <volist name="instru" id="vo">
            <div class="clearfix">
                <div class="booking_title2">{$vo['instruName']}</div>
                <volist name="images" id="value">
                    <if condition="$value['instru']===$vo['id']">
                        <div class="col-md-3 qin-li">
                            <div class="qin-img">
                                <a data-url="{:U('index/getdetail')}"  data-id='{$value["id"]}' href="javascript:" data-toggle="modal" data-target="#qin" class="div_con ajax-post_instru">
                                 <img src="__ROOT__{$value['images']|get_cover='path'}" class="blur"/>
                                </a>
                            </div>
                            <h3>{$value['title']}</h3>
                        </div>
                    </if>
                 </volist>
                 </div>
        </volist>


    </div>
    <!-- qin-info modal -->
<!--    <div id="map" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="gmap3"></div>
            </div>
        </div>
    </div>-->
<div  id="qin" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">标题</h4>
        </div>
        <div class="modal-body ">
            <div class="modal-img">
                <img src="__PUBLIC__/Index/images/rent_img.jpg">
            </div>
            <div class="modal-text">
                asdfasdfasdf
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
  </div>
</div>


     <script type="text/javascript">
        $(".navbar-nav li").eq(4).addClass("active");
    </script>
    <block name="footer"></block>


         

     

</block>